import React, { Component } from 'react';
import {
	StyleSheet, Text, View, TouchableOpacity, Image
} from "react-native";
import { GLOBAL } from '../../../../config/global';
import { style } from '../../../../theme/style';
const scale = GLOBAL.SCALE;

export class Tabs extends Component {
	constructor(props) {
		super(props);
	}

	render () {
		const { tabIndex, checkTab } = this.props;
		return (
			<View style={styles.tabTop}>
				<TouchableOpacity onPress={() => { checkTab(0) }} style={styles.tabBox}>
					<Text style={styles.TabText}>待审批</Text>
					{
						tabIndex == 0 ? <Image source={require('../../../../imgs/apply/triangle.png')} /> : null
					}
				</TouchableOpacity>
				<TouchableOpacity onPress={() => { checkTab(1) }} style={styles.tabBox}>
					<Text style={styles.TabText}>已审批</Text>
					{
						tabIndex == 1 ? <Image source={require('../../../../imgs/apply/triangle.png')} /> : null
					}
				</TouchableOpacity>
			</View>
		)
	}
}
const styles = StyleSheet.create({
	tabTop: {
		height: 40 * scale,
		backgroundColor: style.color.themeColor,
		flexDirection: 'row',
		justifyContent: 'space-around',
		alignItems: 'center'
	},
	tabBox: {
		width: '50%',
		height: 40 * scale,
		marginTop: 5 * scale,
		alignItems: 'center',
		justifyContent: 'space-between'
	},
	TabText: {
		fontSize: 14 * scale,
		color: style.color.white,
		textAlign: 'center'
	},
})